<template>
  <div class="weather">
    <div id="he-plugin-simple" class="he"></div>
  </div>
</template>

<script>
export default {
  name: 'HeadBarQWeather',
  created() {
    // 和风天气插件
    window.WIDGET = {
      CONFIG: {
        "modules": "01234",
        "background": "5",
        "tmpColor": "FFFFFF",
        "tmpSize": "16",
        "cityColor": "FFFFFF",
        "citySize": "16",
        "aqiColor": "FFFFFF",
        "aqiSize": "16",
        "weatherIconSize": "16",
        "alertIconSize": "16",
        "padding": "0px 0px 0px 0px",
        "shadow": "0",
        "language": "auto",
        "fixed": "false",
        "vertical": "center",
        "horizontal": "center",
        "key": "354db0b79eb4439083d4a85ae6cf7f28",
      },
    };
    const script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = "https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0";
    document.getElementsByTagName('head')[0].appendChild(script);
  },
};
</script>

<style scoped>
.weather {
  z-index: 11;
}
</style>